<template>
  <el-dialog :title="`${form.id ? '修改' : '添加'}奥哲检查项`" :visible.sync="show" :close-on-click-modal="false" :show-close="!btnLoading" width="500px" @closed="$refs.form.resetFields()">
    <el-form ref="form" :model="form" :rules="rules" size="small" label-width="140px">
      <el-form-item prop="id" class="hide" />
      <el-form-item prop="parentCode" label="上级">
        <treeselect v-model="form.parentCode" :options="treeOptions" :normalizer="normalizer" show-count placeholder="选择上级" />
      </el-form-item>
      <el-form-item label="检查项编码" prop="chkCode"><el-input v-model.trim="form.chkCode" placeholder="请输入检查项编码" :maxlength="100" /></el-form-item>
      <el-form-item label="检查项名称" prop="chkName"><el-input v-model.trim="form.chkName" placeholder="请输入检查项名称" :maxlength="200" /></el-form-item>
      <el-form-item label="拓展字段" prop="extendField"><el-input v-model="form.extendField" placeholder="请输入拓展字段" :maxlength="255" /></el-form-item>
      <!--<el-form-item label="权重" prop="weight">-->
        <!--<el-input-number v-model="form.weight" controls-position="right" placeholder="请输入权重" :min="0" style="width: 370px;" />-->
      <!--</el-form-item>-->
      <el-form-item label="集团权重" prop="weight">
        <el-input-number v-model="form.weight" controls-position="right" placeholder="请输入权重" :min="0" style="width: 320px;" />
      </el-form-item>
      <el-form-item label="事业部权重" prop="weight">
        <el-input-number v-model="form.weight" controls-position="right" placeholder="请输入权重" :min="0" style="width: 320px;" />
      </el-form-item>
      <el-form-item label="事业部工程部权重" prop="weight">
        <el-input-number v-model="form.weight" controls-position="right" placeholder="请输入权重" :min="0" style="width: 320px;" />
      </el-form-item>
      <el-form-item label="项目权重" prop="weight">
        <el-input-number v-model="form.weight" controls-position="right" placeholder="请输入权重" :min="0" style="width: 320px;" />
      </el-form-item>
    </el-form>
    <div slot="footer">
      <el-button type="primary" :loading="btnLoading" @click="btnSubmit">确 定</el-button>
      <el-button :disabled="btnLoading" @click="show = false">取 消</el-button>
    </div>
  </el-dialog>
</template>
<script>
// 添加或修改检查项
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { nameRule } from '@/utils/validate'
import { editFormMixin } from '@/utils/mixin'
import { qcChkitemconfigAdd, qcChkitemconfigEdit } from '@/api/checkScore/aoZheChkItem'
export default {
  name: 'AZEditChkitem',
  components: { Treeselect },
  mixins: [editFormMixin],
  data() {
    return {
      primaryKey: 'id',
      addApi: qcChkitemconfigAdd,
      updateApi: qcChkitemconfigEdit,
      form: {
        id: '',
        parentCode: '',
        chkCode: '',
        chkName: '',
        extendField: '',
        weight: ''
      },
      rules: {
        chkCode: [{ required: true, message: '请输入检查项编码' }, nameRule],
        chkName: [{ required: true, message: '请输入检查项名称' }]
      },
      treeOptions: []
    }
  },
  methods: {
    opened(item, { treeData }) {
      this.treeOptions = [{ chkCode: '', chkName: '主类目', children: treeData }]
    },
    normalizer(node) {
      if (!node.children?.length) delete node.children
      return { id: node.chkCode, label: node.chkName, children: node.children }
    }
  }
}
</script>
